<template>
	<!-- 新契约工作列表 -CRS个人税收声明 -->
	<div class="fillcontain">
		<!-- 查询条件 -->
		<div class="fastQuery">
			<el-row>
				<el-col :span="2" class="fastQuery_title"><i class="el-icon-tickets"></i><span> 查询条件</span></el-col>
				<el-col :span="10"></el-col>
				<el-col :span="4" class="moreCondition">
					<span v-if="!isShow" @click="showorhide">更多条件 <i class="el-icon-d-arrow-right"></i></span>
					<span v-if="isShow" @click="showorhide">收起 <i class="el-icon-d-arrow-left"></i></span>
				</el-col>
				<el-col :span="8"></el-col>
			</el-row>
		</div>
		<el-form v-show="isShow" :model="searchParams"  label-width="120px" class="search_container">
			<el-row>

				<el-col :span="6" class="common-box">
					<el-form-item label="受理号" prop="caseno">
						<el-input v-model="searchParams.caseno" placeholder="受理号" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6" class="common-box">
					<el-form-item label="保单号" prop="chdrnum">
						<el-input v-model="searchParams.chdrnum" placeholder="保单号"  oninput="if(value.length>8) value=value.slice(0,8)"  clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6" class="common-box">
					<el-form-item label="是否处理" prop="isdelete">
						<el-select v-model="searchParams.isdelete" placeholder="是否处理" clearable>
							<el-option v-for="item in errors" :key="item.value" :label="item.name" :value="item.value"></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="6" class="common-box">
					<el-form-item label="存仓号" prop="depotno">
						<el-input v-model="searchParams.depotno" placeholder="存仓号" clearable></el-input>
					</el-form-item>
				</el-col>
				<el-col :span="6" class="common-box">
					<el-form-item label="扫描时间(起始)" prop="begintime">
						<el-date-picker v-model="searchParams.begintime" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
							placeholder="选择日期" @change="clearTimeSetDefault">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6" class="common-box">
					<el-form-item label="扫描时间(结束)" prop="lasttime">
						<el-date-picker v-model="searchParams.lasttime" type="date" value-format="yyyy-MM-dd" format="yyyy-MM-dd"
							placeholder="选择日期"  @change="clearTimeSetDefault">
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="6" class="text_center">
					<el-button type="primary" icon="el-icon-search" @click="search"></el-button>
					<el-button type="primary" plain  icon="el-icon-refresh" @click="resetSearch"></el-button>
				</el-col>
			</el-row>
		</el-form>
		<div class="contain">
		<!-- 查询结果 -->
		<div class="table_container">
			<el-table
				v-loading="loading"
				:data="tableData"
				highlight-current-row
				header-cell-class-name="table-header-class"
				style="width:100%">
				<el-table-column
				type="selection"
				width="55" :selectable="interceptVip">
				</el-table-column>
				<el-table-column
				min-width="80"
					label="影像信息"
					align='center'>
					<template slot-scope="scope">
					     <el-button type="text" size="small" icon="el-icon-camera" @click="showImage(scope.row)" :disabled="!interceptVip(scope.row, scope.index)"><!--影像信息--></el-button>
					</template>
				</el-table-column>
				<el-table-column
				min-width="120"
				property="SCASENO"
				label="受理号"
				align='center'
				show-overflow-tooltip>
				</el-table-column>
				<el-table-column
				min-width="120"
				property="SDOCTYPE"
				label="单证类型"
				align='center'
				show-overflow-tooltip>
				</el-table-column>
				<el-table-column
				min-width="120"
				property="SPOLICYNO"
				label="保单号"
				align='center'
				show-overflow-tooltip>
				</el-table-column>
				<el-table-column
				min-width="120"
				property="SDEPOTNO"
				label="存仓号"
				align='center'
				show-overflow-tooltip>
				</el-table-column>
				<el-table-column
				min-width="160"
				property="SSCANTIME"
				label="扫描时间"
				align='center'
				show-overflow-tooltip>
				</el-table-column>
				<el-table-column
				min-width="80"
					fixed="right"
					label="操作"
					align='center'>
					<template slot-scope="scope">
						<!-- <el-button type="text" size="small" :disabled="dis(scope.row.SISDELETE)" @click="changeTask(scope.row.STASKNO)">处理</el-button> -->
						<span class="operationIcon" :disabled="dis(scope.row.SISDELETE)" @click="changeTask(scope.row.STASKNO)" :style="{'pointer-events':!interceptVip(scope.row, scope.index) ? 'none': ''}">
                            <i class="el-icon-edit"></i>
                        </span>
					</template>
				</el-table-column>
				<el-table-column
				v-if="false"
				property="STASKNO">
				</el-table-column>
			</el-table>
			<el-row>
				<el-col :span="24">
					<div class="pagination">
						<el-pagination
							background
							v-if='paginations.total > 0'
							:page-sizes="paginations.pageSizes"
							:page-size="paginations.pageSize"
							:layout="paginations.layout"
							:total="paginations.total"
							:current-page='paginations.pageIndex'
							@current-change='handleCurrentChange'
							@size-change='handleSizeChange'>
						</el-pagination>
					</div>
				</el-col>
			</el-row>
		</div>
		</div>
		<!--影像列表-->
		<cdfs-image-list :drawer="showImageFlag" :applnum="showImageApplnum" @close="hideImage"></cdfs-image-list>

		</div>
</template>

<script>
	import constant from '@/utils/constant';
	import TaskConstants,{call} from "@/api/taskManager/common";
	import cdfsImageList from "@/page/common/cdfsImageList";
	import  {
		isCntainChinese,
		isNotNumber
	} from "@/api/refund/RefundCommon";

	export default {
		components: {
			cdfsImageList
		},
		data(){
			return {
				loading:false,
				isShow:false,
				docTypeMap:{},
				tableData:[],
				showImageFlag:false,
				showImageApplnum:'',
				emptySearchParams:{},
				searchParams:{
					busitype:'crs',
					caseno:'',
					chdrnum:'',
					isdelete:'N',//默认查询crs个人税收未处理任务
					depotno:'',
					begintime:'',
					lasttime:'',
					type:'crs',
					pageNumber:'',
					pageSize:'',
				},
				errors:[
					//任务 待处理
					{name:"待处理",value:"N"},
					//任务已处理;
					{name:"已处理",value:"Y"},
				],
				//需要给分页组件传的信息
				paginations: {
					total: 0,        // 总数
					pageIndex: 1,  // 当前位于哪页
					pageSize: 10,   // 1页显示多少条
					pageSizes: [5, 10, 15, 20],  //每页显示多少条
					layout: "total, sizes, prev, pager, next, jumper"   // 翻页属性
				},
				isFirstEnter:false
			}
		},
		created() {
			this.emptySearchParams= JSON.parse(JSON.stringify(this.searchParams));
		},
		mounted(){
			setTimeout(()=>{
				this.isFirstEnter=true;
			},100)
		},
		activated() {
			if(this.isFirstEnter){
				this.search();
			}
			document.onkeydown = (event)=>{
				var e = event || window.event || arguments.callee.caller.arguments[0];
				if (e && e.keyCode == 113) {
					this.search();
				}
			};
		},
		methods: {
			showImage(row) {
				this.showImageApplnum = row.SPOLICYNO;
				this.showImageFlag = true;
			},
			hideImage() {
				this.showImageApplnum = "";
				this.showImageFlag = false;
			},
			dis(isdelete) {
				if ( isdelete== 'Y'){
					return false;
				}
				return true;
			},
			showorhide() {
				this.isShow = !this.isShow;
			},
			show() {
				this.$store.dispatch('loading/CHANGE_LOADING', true);
			},
			cancle() {
				this.$store.dispatch('loading/CHANGE_LOADING', false)
			},
			// 每页多少条切换
			handleSizeChange(pageSize) {
				this.paginations.pageSize = pageSize;
				this.getList();
			},
			// 上下分页
			handleCurrentChange(page) {
				this.paginations.pageIndex = page;
				this.getList();
			},
			// 清除查询条件
			resetSearch(){
				this.searchParams = JSON.parse(JSON.stringify(this.emptySearchParams));
			},
			search() {
				if(this.searchParams.chdrnum !="" ){
					if ( isNotNumber(this.searchParams.chdrnum) || this.searchParams.chdrnum.length !=8) {
						this.$message.error("请正确输入保单号！");
						return;
					}
				}
				if(this.searchParams.caseno !="" && isNotNumber(this.searchParams.caseno) ){
					this.$message.error("请正确输入受理号！");
					return;
				}
				if(this.searchParams.depotno !="" && isCntainChinese(this.searchParams.depotno)){
					this.$message.error("请正确输入存仓号！");
					return;
				}
				if(this.searchParams.begintime && this.searchParams.lasttime){
					let oDate1 = new Date(this.searchParams.begintime);
					let oDate2 = new Date(this.searchParams.lasttime);
					if(oDate1.getTime() > oDate2.getTime()){
						this.$message.error("起始时间不能大于结束时间！");
						return;
					}
				}
				this.getList();
			},
			clearTimeSetDefault(val) {
				if (val == null) {
					val = '';
				}
			},
			getList() {
				this.show();
				this.paginations.total = 0;
				this.tableData = [];
				this.searchParams.pageNumber = this.paginations.pageIndex;
				this.searchParams.pageSize = this.paginations.pageSize;
				call(TaskConstants.apis.querynbcrsList,this.searchParams,"POST").then( res =>{
					if(res.resultCode == constant.SUCCESS && res.data && res.data.list.length){
						this.paginations.total = res.data.total;
						this.tableData = res.data.list;
					} else {
						this.$message.error("无符合条件任务！");
					}
					this.cancle();
				}).catch( err =>{
					this.cancle();
				})
			},
			/* 任务处理 */
			changeTask(taskno){
				this.show();
				let condition = `?taskno=`+taskno;
				call(TaskConstants.apis['changeCRSTask']+condition,null,"post").then(res =>{
					this.cancle();
					if(res.resultCode == constant.SUCCESS ){
						this.$message({
							message: res.resultMsg,
							type: "success"
						});
						this.getList();
					} else {
						this.$message({
							message: res.dresultMsg,
							type: "error"
						});
					}
				}).catch(err =>{
					this.cancle();
				})
			},
      // vip权限拦截
      interceptVip(row, index) {
        let rowStr = JSON.stringify(row);
        if (rowStr.indexOf("*") > -1) {
          return false;
        }
        return true;
      },
    }
	}
</script>

<style lang="less" scoped>
    .fillcontain{
        padding-bottom: 0;
        .fastQuery {
            padding: 15px 20px 10px 20px;
            background: #fff;
            border-bottom: 1px solid #e1e1e1;
            .fastQuery_title {
                color: #666;
                padding: 6px 0px;
            }
            .fastQuery_item {
                margin: 0 10px;
            }
            .item_default {
                .el-button {
                    color: #409EFF !important;
                    border-color: #c6e2ff !important;
                    background-color: #ecf5ff !important;
                }

            }
            .moreCondition {
                color: #68a3fc;
                cursor: pointer;
                padding: 6px 0px;

                .el-icon-d-arrow-right {
                    transform: rotate(90deg);
                }

                .el-icon-d-arrow-left {
                    transform: rotate(-90deg);
                }
            }
        }
    }
    .contain{
        background: #fff;
        padding: 10px;
        margin-bottom: 20px;
    }
   .pagination{
       padding: 10px 20px;
       text-align: right;
   }
   .operationIcon{
        // padding: 12px;
        border:1px solid #e5e5e5;
        border-radius: 50%;
        width: 22px;
        height: 22px;
        display: inline-block;
        cursor: pointer;
        box-shadow:0 0 3px #f9f9f9;
   }
   .search_container{
       padding: 20px 20px 0 20px;
    //    border-top: 1px solid #e1e1e1;
   }
   .common-box{
        padding-bottom: 15px;
    }
    .common-lab{
        line-height:normal!important;
        text-align: right;
        .labelName{
            text-align: right;
        }
    }
</style>



